$(function () {
    const cateBox = document.querySelector('.cate_box > ul')
    const pagiBox = document.querySelector('.pagi_box')
    const id = window.sessionStorage.getItem('id')
    getCateList()
    async function getCateList() {
        // 1-1. 发送请求, 请求分类列表
        const res = await $.ajax({
            url: `http://localhost:6060/goods/category`,
            method: 'get'
        })
        console.log(res);
        // 1-2. 使用 res.list 渲染分类
        cateBox.innerHTML = res.result.reduce((prev, item) => {
            return prev + `<li class="cate"data-index=${item}>${item}</li> `
        }, '<li class="cate" data-index="">全部</li>')
    }
    const goods_info = {
        current: 1,
        pagesize: 12,
        search: '',
        filter: '',
        sale_type: '',
        sortType: '_id',
        sortMethod: 'ASC',
        category: ''
    }
    getGoodsList()
    async function getGoodsList() {
        const res = await $.ajax({
            url: `http://localhost:6060/goods/list`,
            data: goods_info,
            method: 'get'
        })
        console.log(res);
        $('.pagi_box').html(template('pagi_template', { pagesize: goods_info.pagesize, current: goods_info.current, total: res.total }))
        $('.goods_list').html(template('list_template', { list: res.list }))
    }
    $('.filterBox').on('click', (e) => {
        const t = e.target
        if (t.className === 'cate') {
            // 1. 排他

            [...t.parentElement.children].forEach(item => item.classList.remove('active'));
            t.classList.add('active')

            // 2. 拿到当前按钮所表示的内容
            goods_info.current = 1
            goods_info.category = t.dataset.index
            console.log(goods_info.filter);
            // 3. 从新请求最新的数据, 渲染页面
            getGoodsList()

        }

        // 点击的是筛选相关
        if (t.className === 'filter') {
            // 1. 排他

            [...t.parentElement.children].forEach(item => item.classList.remove('active'));
            t.classList.add('active')

            // 2. 拿到当前按钮所表示的内容
            goods_info.current = 1
            goods_info.filter = t.dataset.index
            // 3. 从新请求最新的数据, 渲染页面


            getGoodsList()
        }



        // 点击的是折扣相关
        if (t.className === 'sale') {
            // 1. 排他

            [...t.parentElement.children].forEach(item => item.classList.remove('active'));
            t.classList.add('active')
            // 2. 拿到当前按钮所表示的内容


            goods_info.current = 1
            goods_info.saleType = t.dataset.index

            // 3. 从新请求最新的数据, 渲染页面
            getGoodsList()


        }



        // 点击的是排序相关

        if (t.className === 'sort') {
            // 1. 排他

            [...t.parentElement.children].forEach(item => item.classList.remove('active'));
            t.classList.add('active')
            // 2. 拿到当前按钮所表示的内容


            goods_info.sortType = t.dataset.type
            goods_info.sortMethod = t.dataset.method

            // 3. 从新请求最新的数据, 渲染页面
            getGoodsList()


        }

        if (t.className === 'prev') {

            // 点击上一页按钮

            // }
            goods_info.current--
            getGoodsList()

        }
        if (t.className === 'next') {

            // 点击的是下一页
            goods_info.current++
            getGoodsList()
        }
        // 点击跳转某一页
        if (t.className === 'go') {

            // 1. 拿到你在文本框输入的内容
            let current = t.previousElementSibling.value - 0
            const total = t.dataset.total - 0
            // 2. 对 current 进行判断
            if (isNaN(current)) current = 1
            current = parseInt(current)
            if (current < 1) current = 1
            if (current > total) current = total
            console.log(current);
            // 3. 给 goods_info 内的赋值
            goods_info.current = current
            console.log(goods_info.current);
            // 4. 渲染页面
            getGoodsList()

        }
    })
    $('.goods_list').on('click', (e) => {
        const t = e.target
        if (t.nodeName === 'LI') {
            // 拿到商品id
            const goods_id = e.target.dataset.id
            // 存储到 sessionStorage
            window.sessionStorage.setItem('goods_id', goods_id)
            // 跳转页面
            window.location.href = '/pages/detail'
            return
        }
        if (e.target.className === 'addCart') {

            // 执行加入购物车的逻辑
            addCart(e.target.dataset.id)
        }
        if (e.target.className === 'buy') {
            console.log('立即购买')
        }
    })
    async function addCart(goods_id) {
        // 7-2. 判断 token 和 id 不存在
        if (!id) {
          if (window.confirm('您还没有登录, 点击确定直接登录, 点击取消留在当前页')) {
            window.sessionStorage.setItem('page', 'list')
            window.location.href = '/pages/login'
          }
          return
        }
        // console.log(id, goods_id);
        // 7-3. 发送请求
        const res = await $.ajax({
          url: '/cart/add',
          data: { id, goods_id},
          method: 'POST'
        })
        if (res.code !== 1) {
          if (window.confirm('您还没有登录, 点击确定直接登录, 点击取消留在当前页')) {
            window.sessionStorage.setItem('page', 'list')
            window.location.href = '/pages/login'
          }
          return
        }
  
        // 加入购物车成功
        alert('加入购物车成功')
      }
})